<template>
  <div class="header-box">
    <!--<router-view v-if="isRouterAlive"></router-view>-->
    <div class="handle">
      <!-- <a href="javascript:;" class="search"></a> -->
      <!-- <a href="javascript:;" class="full"></a> -->
      <BreadCrumb />
    </div>

    <div class="user">
      <p class="text" style="margin-left: 10px">用户：{{ info.nick_name }}</p>
      <p class="text">
        当前项目组：
        <el-select
          size="mini"
          v-model="value"
          placeholder="请选择"
          @change="changeOrg"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </p>
      <p class="text">
        <span
          class="item-link"
          @click="$router.push('/index-casc?name=index')"
          style="cursor: pointer"
        >
          <span>返回首页</span>
        </span>
      </p>
      <div class="user-box">
        <el-dropdown trigger="click">
          <span class="el-dropdown-link">
            <img src="@/assets/img/avatar_user.png" slot="reference" alt="" />
            <!--            <div class="avatar"></div>-->
          </span>
          <el-dropdown-menu slot="dropdown" class="dropdown">
            <el-dropdown-item v-show="this.$isFirstPage">
              <span @click="$router.push('/my/info')">个人中心</span>
            </el-dropdown-item>
            <el-dropdown-item v-if="!this.$isReinforce">
              <span @click="$router.push('/inout')">S3管理</span>
            </el-dropdown-item>
            <el-dropdown-item v-if="!this.$isReinforce">
              <span @click="$router.push('/my_market')">我的发布</span>
            </el-dropdown-item>
            <el-dropdown-item >
              <span @click="logout" >登出</span>
            </el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import BreadCrumb from "../components/module/breadCrumb.vue";
import { revokeToken } from "@/api/login";
import { userOrgs } from "@/api/user";
import { displaceToken } from "@/api/login";
import Vue from "vue";
import { removeCookie, setCookie } from "@/utils/tool";
//import { confirm } from 'element-ui'
export default {
  /*  provide () {
        return {
            reload: this.reload
        }
    },*/
  data() {
    return {
      app_user: process.env.VUE_APP_USER,
      org: "",
      info: {},
      //isRouterAlive: true
      args: [],
      /*options: [{
          value: '1509889866203168',
          label: '测试项目组1025'
      }, {
          value: '1510136417878048',
          label: '测试项目组1026'
      }],*/
      options: [],
      value: "",
      oldValue: "",
      visible: false,
      link: "http://192.168.8.204:8082/#/",
    };
  },
  components: { BreadCrumb },
  name: "vHeader",
  props: [],
  methods: {
    async logout() {
      removeCookie("refresh_token");
      removeCookie("login_ticket");
      removeCookie('path');
      removeCookie('roles');
      removeCookie('username');
      this.$router.replace({
        path: "/login",
      });
      console.log("user1010");
    },
    async ltLogout() {
      await revokeToken();

      await axios.get("http://192.172.0.84/idp/profile/OAUTH2/Redirect/GLO", {
        params: {
          redirectToLogin: true,
          redirectToUrl: "192.168.191.12:8082/#/index-casc?name=index",
        },
      });
      removeCookie("refresh_token");
      removeCookie("login_ticket");

      window.location.href =
        "http://192.172.0.84/idp/oauth2/authorize?redirect_uri=http%3A%2F%2F192.168.191.12%3A8082%2F%23%2Findex-casc%3Fname%3Dindex&state=1&client_id=ZNTX&response_type=code";
    },
    async changeOrg(id) {
      var obj = new Object();
      obj.organizationId = id;
      //console.log(obj)
      this.$messageBox
        .confirm("此操作将会刷新页面, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
        .then(async () => {
          var res = await displaceToken({ organizationId: obj.organizationId });
          //console.log("res:",`Bearer ${res.data.access_token}`,res.data.refresh_token)
          if (res.code == 200) {
            setCookie("login_ticket", `Bearer ${res.data.access_token}`);
            setCookie("refresh_token", res.data.refresh_token);
            this.oldValue = obj.organizationId;
            window.location.reload();
          }
          this.$message({
            type: "success",
            message: "操作成功!",
          });
        })
        .catch(async () => {
          this.value = this.oldValue;
          this.$message({
            type: "info",
            message: "已撤销",
          });
        });
    },
  },

  async beforeCreate() {
    if (this.$indexReload == 1) {
      Vue.prototype.$indexReload = 0;
      window.location.reload();
    }
    //console.log(this)
    this.info = await this.$myInfo(this);
    //console.log("用户数据：",this.info)
    if (this.info != null) {
      var obj = new Object();
      obj.userId = this.info.id;
      this.orgs = await userOrgs(obj);
      //console.log("orgs:",this.orgs.data,this.orgs.data.length)
      if (this.orgs != null && this.orgs.data.length > 0) {
        for (var i = 0; i < this.orgs.data.length; i++) {
          var option = new Object();
          option.value = this.orgs.data[i].organization.id;
          option.label = this.orgs.data[i].organization.name;
          this.options.push(option);
        }
        this.value = this.info.organization_id;
      }
    }
    //
    this.oldValue = this.value;
  },
  /*    async created(){
        //this.info.organization_id =
      }*/
};
</script>

<style lang="less" scoped>
.demonstration {
  display: block;
  color: #8492c2;
  font-size: 14px;
  margin-bottom: 20px;
}

.user {
  display: flex;
}

.dropdown {
  background: rgba(#8492c2, 1);
  border: 0 !important;
}

/deep/ .el-popover {
  border: 0;
}

.user-box-item {
  text-align: center;
  border: 0;

  a {
    color: #409eff;
  }
}
</style>
